<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/rem/top.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		<link rel="stylesheet" type="text/css" href="./css/rem/reste.css"/>
		 <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
	</head>
	<body>
		<div class="header">
			<div class="container">
				<div class="zt">
					<nav class="navbar">
						<a href="" class="logo"><img src="./image/logo1.png" ></a>
						<!-- <button class="navbar-b">
							<span class="navbar-toggler-icon">
								
							</span>
						</button> -->
						<div class="collapse">
							<ul class="nav-navbar">
								<li>
									<a href="index.html" class="nav-link">网站首页</a>
									</li>
								<li  class="nav-item active"><a href="one.html" class="nav-link">关于我们</a></li>
								<li><a href="two.html" class="nav-link">加入我们</a></li>
								<li><a href="three.html" class="nav-link">新闻动态</a></li>
							</ul>
						</div>
					</nav>
				</div>
			</div>
		</div>	
			<div class="masker"></div>
			<!-- 主体内容 -->
			<div class="swiper-container pc swiper-container-horizontal">
				<div class="swiper-wrapper" >
					<!-- style="transition-duration: 0ms; transform: translate3d(-3840px, 0px, 0px);" -->
					<div class="swiper-slide swiper-slide-duplicate swiper-slide-duplicate-active" style="width: 1920px;">
						<img src="./image/first-banner2.png" alt="">
					</div>
					
				</div>
			</div>
			<div class="container">
				<div class="main">
					<div class="main-top">
						<p class="title"></p>
						<p class="desc"></p>
						<p class="ages" style="text-align: center;  margin-top: 0; margin-bottom: 1rem; 	margin-top: 30px;">
							<span style="font-size: 20px;"></span>
						</p>
						<p></p>
						<div style="display: inline-block; vertical-align: middle ; width: 100% ; text-align: center; ">
							<a href="#" class="more">了解更多</a>
							<img src="./img/right_icon.png" alt="" class="right-arrow">
						</div>
					</div>
					<div class="main-center">
						<div class="item left">
							<p class="title"></p>
							<p class="desc"></p>
							<p>
								<span class="tit" style="color: rgb(0, 0, 0);">
									<span style="font-size: 20px;"></span>
									<sapn style="font-size: 20px;"></sapn>
								</span>
							</p>
							<p>
								<span style="font-size: 20px; color: rgb(242, 242, 242);"></span>
								<br>
							</p>
							<p></p>
							<img src="" alt="" class="images">
						</div>
						<div class="item center">
							<p class="title"></p>
							<p class="desc"></p>
							<p>
								<span class="tit" style="color: rgb(0, 0, 0);">
									<span style="font-size: 20px;"></span>
									
								</span>
							</p>
							<p>
								<span style="font-size: 20px; color: rgb(242, 242, 242);"></span>
								<br>
							</p>
							<p>
								<span style="font-size: 20px; color: rgb(242, 242, 242);"></span>
								<br>
							</p>
							<p></p>
							<img src="" alt="" class="images">	
						</div>
						<div class="item right">
							<p class="title"></p>
							<p class="desc"></p>
							<p>
								<span class="tit" style="color: rgb(0, 0, 0);">
									<span style="font-size: 20px;"></span>
									<sapn style="font-size: 20px;"></sapn>
								</span>
							</p>
							<p>
								<span style="font-size: 20px; color: rgb(242, 242, 242);"></span>
								<br>
							</p>
							<p></p>
							<img src="" alt="" class="images">
						</div>
					</div>
					<div class="main-bottom">
						<div class="top">
							<p class="title">旗下项目-高考志愿者工具</p>
							<p class="desc"></p>
							<p style="text-align: center;">
								<span style='background-color: rgb(242, 242, 242); color: rgb(34, 34, 34); font-family: Consolas, "Lucida Console", "Courier New", monospace; white-space: pre-wrap;'>高考志愿者工具</span>
								<span style='color: rgb(34, 34, 34); font-family: Consolas, "Lucida Console", "Courier New", monospace; white-space: pre-wrap; font-size: 16px; background-color: rgb(242, 242, 242);'>是一款辅助高考考生填写志愿的微信小程序，收录了各个高校历年录取分数线，方便考生查看对比。</span>
							</p>
						</div>
						<div class="bottom">
							<p class="title"> 精挑细选、实事求是的数据送到TA面前</p>
							<p class="desc"> <p>
							<p>
								<span style="color: rgb(0, 0, 0);">
									<span style='font-family: Consolas, "Lucida Console", "Courier New", monospace; white-space: pre-wrap; font-size: 20px;", "Courier New", monospace; white-space: pre-wrap;'>大数据赋能，严选好货树信任，认</span>
									<span style='font-family: Consolas, "Lucida Console", "Courier New", monospace; white-space: pre-wrap; font-size: 20px;'>真服务立口碑！</span>
								</span>
							</p>
							<p></p>
							<a href="" class="more" target="_blank">
								了解更多产品信息
								<span class="right-arrow1">
									
								</span>
							</a>
						</div>
					</div>
				</div>
			</div>
		<footer>
			<div class="container sx-footer">
				<div class="left">
					<div class="cic">
						<a href="" class="footer-link pl10" target="_back">产品网站</a>
						<a href="">加入我们</a>
						<a href="">服务协议</a>
						<a href="" style="border: none">隐私协议</a>
					</div>
					<a href="">粤ICP备19120912号</a>
					<br>
				</div>
				<div class="right">
					<p class="wx"> 官方微信 </p>
					<img src="./img/gaokaoxue.jpg" alt="微信二维码">
				</div>
			</div>
		</footer>
		<script>
			
			
			            $.getJSON('http://192.168.1.7:8900/learn/index/',function(data){
			                $('.nav-link').eq(0).html(
			                    `
								${data.title[0]}
			                  
			                    `
			                );
							$('.nav-link').eq(1).html(
							    `
								${data.title[1]}
							  
							    `
							);
							$('.nav-link').eq(2).html(
							    `	
								${data.title[2]}
							  
							    `
							);
							$('.nav-link').eq(3).html(
							    `
								${data.title[3]}
								
							  
							    `
							);
							// http://www.21xuewang.cn/static/media/banner/logo1.png
							// $('img').eq(0).attr(`src`, `"http://192.168.1.7:8900/static/media/"+${data.logo_image}`);
							$('img').eq(0).attr(`src`,`http://192.168.1.7:8900/static/media/`+`${data.logo_image}`);
							// $('.left>img').eq(0).attr(`src`, `${data.foot_image}`);
							// $('.center>img').eq(0).attr(`src`, `${data.foot_image}`);
							// $('.right>img').eq(0).attr(`src`, `${data.foot_image}`);
							$('.main-top>.title').eq(0).html( `${data.about_title}`);
							$('.ages>span').eq(0).html( `${data.about_article}`);
							$('.left>.title').eq(0).html( `${data.product_content[0][0]}`);
							$('.left>p>.tit>span').eq(0).html( `${data.product_content[0][1]}`);
							$('.left>img').eq(0).attr(`src`, `${data.product_content[0][2]}`);
							$('.center>.title').eq(0).html( `${data.product_content[1][0]}`);
							$('.center>p>.tit>span').eq(0).html( `${data.product_content[1][1]}`);
							$('.center>img').eq(0).attr(`src`, `${data.product_content[1][2]}`);
							$('.right>.title').eq(0).html( `${data.product_content[2][0]}`);
							$('.right>p>.tit>span').eq(0).html( `${data.product_content[2][1]}`);
							$('.right>img').eq(0).attr(`src`, `${data.product_content[2][2]}`);
							
							$('.sx-footer>.left>a').eq(0).html( `${data.record}`);
						
							$('.left>.title').eq(0).html( `${data.product_content[0][0]}`);
							$('.swiper-wrapper>.swiper-slide>img').eq(0).attr(`src`, `http://192.168.1.7:8900/static/media/`+`${data.rotate_image.split(',')[0]}`);
							$('.swiper-wrapper>.swiper-slide>img').eq(1).attr(`src`, `http://192.168.1.7:8900/static/media/`+`${data.rotate_image.split(',')[1]}`);
							$('.left>.left>a').eq(0).html( `${data.record}`);
							$('.sx-footer>.left>.cic>a').eq(0).html( `${data.foot_title.split(',')[0].substring(2,6)}`);
							$('.sx-footer>.left>.cic>a').eq(1).html( `${data.foot_title.split(',')[1].substring(1,5)}`);
							$('.sx-footer>.left>.cic>a').eq(2).html( `${data.foot_title.split(',')[2].substring(1,5)}`);
							$('.sx-footer>.left>.cic>a').eq(3).html( `${data.foot_title.split(',')[3].substring(1,5)}`);
							
							console.log(`${data.foot_title.split(',')[0]}`);
			            });
						
		</script>
	</body>
</html>
